<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>
<head>
    <base href="<%=basePath%>">
    <title>图书管理界面</title>
    <meta charset="UTF-8">

    <link rel="stylesheet" type="text/css" href="css/admin/bookDetail.css">

    <%-- 引入jquery --%>
    <script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>

    <%--  引入bootstrap框架--%>
    <link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>

    <%-- 引入Bootstrap datetimepicker插件 --%>
     <link href="jquery/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>

    <%-- 引入pagination --%>
     <link type="text/css" href="jquery/bs_pagination-master/css/jquery.bs_pagination.min.css" rel="stylesheet"/>
    <script type="text/javascript" src="jquery/bs_pagination-master/js/jquery.bs_pagination.min.js"></script>
    <script type="text/javascript" src="jquery/bs_pagination-master/localization/en.js"></script>

    <script type="text/javascript">
        $(function (){
            // 调用查询页面函数
            queryBookInformationByPage(1,10);

            // 给查询书籍按钮添加单击事件
            $("#queryBooks").click(function (){
                queryBookInformationByPage(1,$("#search_bo").bs_pagination('getOption','rowsPerPage'))
            });

            // 给添加书籍按钮添加单击事件
            $("#addBooks").click(function (){
                // 显示模态窗口
                $("#myModal").modal("show");
            });

            // 当容器加载完成之后，对容器调用工具函数
            $("#pubdate").datetimepicker({
                language:'zh-CN', // 语言 中文
                format:'yyyy-mm-dd', // 日期格式
                minView:'month', // 可以选择的最小视图
                autoclose:true, // 设置选择完日期后是否自动关闭日历，默认是false
                initalDate:new Date(), // 初始化显示的日期
                todayBtn:true, // 表示是否显示今天按钮，默认是false
                clearBtn:true, // 设置是否显示清空按钮，默认是false
                pickerPosition:'top-left'
            });

            // 给添加书籍按钮添加单击事件
            $("#saveCreateBook").click(function (){
                // 收集参数
                var bookAccount = $.trim($("#bookAccount").val());
                var bookName = $.trim($("#bookName").val());
                var author = $.trim($("#author_").val());
                var publisher = $.trim($("#publisher_").val());
                var pubdate = $.trim($("#pubdate").val());
                var price = $.trim($("#price").val());

                //发送请求
                $.ajax({
                    url:'workbench/admin/book/saveCreateBook.do',
                    data: {
                        bookAccount:bookAccount,
                        bookName:bookName,
                        author:author,
                        publisher:publisher,
                        pubdate:pubdate,
                        price:price
                    },
                    type:'post',
                    dataType: 'json',
                    success:function (data){
                        if (data.code=="1"){
                            // 关闭模态窗口
                            $("#myModal").modal("hide");
                            // 刷新列表
                            queryBookInformationByPage(1,$("#search_bo").bs_pagination('getOption','rowsPerPage'))
                        }else{
                            alert(data.message);
                            // 模态窗口不关闭
                            $("#myModal").modal("show");
                        }
                    }
                })
            });

            // 给所有的删除按钮添加单击事件
            $("#body").on("click","button[name='deleteBookBtn']",function (){
                // 收集表单信息
                var bookId = this.value;
                // 用户确定删除
                if (window.confirm("确定删除吗？")==true){
                    // 发送请求
                    $.ajax({
                        url:"workbench/admin/book/deleteBookByBookId.do",
                        data:{
                            bookId:bookId
                        },
                        type:'post',
                        dataType:'json',
                        success:function (data){
                            if (data.code=="1"){
                                // 刷新列表
                                queryBookInformationByPage(1,$("#search_bo").bs_pagination('getOption','rowsPerPage'));
                            }else{
                                alert(data.message);
                            }
                        }
                    })
                }
            });

            // 给所有的修改按钮添加单击事件
            $("#body").on("click","button[name='updateBookBtn']",function (){
                // 收集表单信息
                var bookId = this.value;
                // 查询书籍信息
                $.ajax({
                    url:'workbench/admin/book/queryBookInformationByBookId.do',
                    data:{
                        bookId:bookId
                    },
                    type:'post',
                    dataType:'json',
                    success:function (data){
                        // 填写修改模态窗口数据
                        $("#bookId-update").val(bookId),
                        $("#bookAccountUpdate").val(data.bookAccount);
                        $("#bookNameUpdate").val(data.bookName);
                        $("#publisherUpdate").val(data.publisher);
                        $("#authorUpdate").val(data.author);
                        $("#priceUpdate").val(data.price);
                        $("#existUpdate").val(data.exist);
                        $("#pubdateUpdate").val(data.pubdate);
                    }
                });
                // 显示模态窗口
                $("#myModalUpdate").modal("show");
            });

            // 给所有的确认修改按钮添加单击事件
            $("#updateBookBtn").click(function (){
               // 收集参数
                var bookId=$("#bookId-update").val();
                var bookAccount=$("#bookAccountUpdate").val();
                var bookName=$.trim($("#bookNameUpdate").val());
                var publisher=$.trim($("#publisherUpdate").val());
                var author=$.trim($("#authorUpdate").val());
                var price=$.trim($("#priceUpdate").val());
                var exist=$("#existUpdate").val();
                var pubdate=$("#pubdateUpdate").val();

                // 发送请求
                $.ajax({
                    url:'workbench/admin/book/updateBookByBookId.do',
                    data:{
                        bookId:bookId,
                        bookAccount:bookAccount,
                        bookName:bookName,
                        publisher:publisher,
                        pubdate:pubdate,
                        author:author,
                        price:price,
                        exist:exist
                    },
                    type:'post',
                    dataType:'json',
                    success:function (data){
                        if(data.code=="1"){
                            // 关闭模态窗口
                            $("#myModalUpdate").modal("hide");
                            // 更新列表信息
                            queryBookInformationByPage(1,$("#search_bo").bs_pagination('getOption','rowsPerPage'));
                        }else{
                            alert(data.message);
                            // 模态窗口不关闭
                            $("#myModalUpdate").modal("show");
                        }
                    }
                })
            });
        })



        // 根据条件查询所有的书籍信息
        function queryBookInformationByPage(pageNo,pageSize){
            // 收集表单
            var book_name = $.trim($("#book_name").val());
            var author = $.trim($("#author").val());
            var publisher = $.trim($("#publisher").val());
            // alert(author+"-"+author+"-"+publisher);

            // 发送ajax请求查询信息
            $.ajax({
                url:'workbench/admin/queryAllBooksForPage.do',
                type:'post',
                dataType:'json',
                data:{
                    bookName:book_name,
                    author:author,
                    publisher:publisher,
                    pageNo:pageNo,
                    pageSize:pageSize
                },
                success:function (res){
                    var str="";
                    str+="<tr>";
                    str+="<td>ISBN</td>";
                    str+="<td>书籍名称</td>";
                    str+="<td>作者</td>";
                    str+="<td>出版社</td>";
                    str+="<td>价格</td>";
                    str+="<td>操作</td>";
                    str+="<td>操作</td>";
                    str+="</tr>";
                    // 渲染页面
                    $.each(res.books,function (index,obj){
                        str+="<tr>";
                        str+="<td>"+obj.bookAccount+"</td>";
                        str+="<td>"+obj.bookName+"</td>";
                        str+="<td>"+obj.author+"</td>";
                        str+="<td>"+obj.publisher+"</td>";
                        str+="<td>"+obj.price+"</td>";
                        // str+="<td><button>删除<button></td>";
                        str+="<td><button name=\"deleteBookBtn\" value=\""+obj.bookId+"\">删除</button></td>";
                        str+="<td><button name=\"updateBookBtn\" value=\""+obj.bookId+"\">查看修改</button></td>";
                        str+="</tr>";
                    });
                    $("#body").html(str);

                    // 计算总页数
                    var totalPages=Math.ceil(res.totalRows/pageSize);

                    // 对容器调用bs_pagination工具函数，显示翻页信息
                    $("#search_bo").bs_pagination({
                        currentPage:pageNo, // 当前页号，默认值1，相当于pageNo

                        // 必须满足 totalRows=totalPages*rowsPerPage
                        totalPages:totalPages, // 总页数，必填项
                        rowsPerPage:pageSize, // 每页显示条数，默认是10，相当于pageSize
                        totalRows:res.totalRows, // 总条数，默认值是1000

                        visiblePageLinks:5, //最多可以显示的一组卡片数，默认是5

                        showGoToPage:true, // 是否显示跳转到第几页部分，默认是true
                        showRowsPerPage:true, // 是否显示每页显示条数部分，默认是true
                        showRowsInfo:true, //是否显示记录的信息部分，默认是true

                        // 用户每次切换页面的时候执行函数
                        // 该函数返回切换页号之后的pageNo和pageSize
                        onChangePage:function (event,pageObj){
                            queryBookInformationByPage(pageObj.currentPage,pageObj.rowsPerPage);
                        }
                    })
                }
            })

        }
    </script>
</head>
<body>

    <%-- 添加书籍模态窗口 --%>
    <div class="modal fade" id="myModal">
        <div id="search_add">
            <div id="search_body_add">
                <form method="post" action="#">
                    <div>
                        <label>ISBN</label>
                        <input class="in" type="text" id="bookAccount" name="id" required="required" />
                    </div>
                    <div>
                        <label>书籍名称</label>
                        <input class="in" type="text" id="bookName" required="required" name="name" />
                    </div>
                    <div>
                        <label>作者</label>
                        <input class="in" type="text" id="author_" required="required" name="author" />
                    </div>
                    <div>
                        <label>出版社</label>
                        <input class="in" type="text" id="publisher_" required="required" name="publisher" />
                    </div>
                    <div>
                        <label>出版时间</label>
                        <input class="in" type="text" id="pubdate" required="required" name="publisher" readonly />
                    </div>
                    <div>
                        <label>价格</label>
                        <input class="in" type="text" id="price" name="price"  required="required" />
                    </div>
                    <div>
                        <input class="update"  type="button" value="添加" id="saveCreateBook"/>
                        <input class="update" type="button" value="返回" data-dismiss="modal" />
                    </div>
                </form>
            </div>
        </div>
    </div>

    <%-- 修改书籍模态窗口 --%>
    <div class="modal fade" id="myModalUpdate">
        <div id="search_update">
            <div id="search_body_update">
                <form method="post" action="#">
                    <input type="hidden" id="bookId-update">
                    <div>
                        <label>账号</label>
                        <input class="in" type="text" id="bookAccountUpdate" name="id" readonly="readonly"/>
                    </div>
                    <div>
                        <label>书名</label>
                        <input class="in" type="text" id="bookNameUpdate" name="name"/>
                    </div>
                    <div>
                        <label>出版社</label>
                        <input class="in" type="text" id="publisherUpdate" name="publisher" />
                    </div>
                    <div>
                        <label>价格</label>
                        <input class="in" type="text" id="priceUpdate" name="price"/>
                    </div>
                    <div>
                        <label>作者</label>
                        <input class="in" type="text" id="authorUpdate" name="author"/>
                    </div>
                    <div>
                        <label>在馆</label>
                        <input class="in" type="text"  id="existUpdate" name="exist" readonly="readonly"/>
                    </div>
                    <div>
                        <label>出版时间</label>
                        <input class="in" type="text" id="pubdateUpdate" name="pubdate" readonly="readonly"/>
                    </div>
                    <div>
                        <input id="updateBookBtn" type="button" value="修改"/>
                        <input class="update" type="button" value="返回" data-dismiss="modal" />
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!--主窗口-->
    <div class="body_right">
        <div id="search">
            <div id="search_head">
                <form id ="form1" method="post" action="AddRecordServlet">
                    <span>图书名</span><input class="search_in" id="book_name" type="text"/>
                    <span>作者</span><input class="search_in" id="author" type="text"/>
                    <span>出版社</span><input class="search_in" id="publisher" type="text"/>
                    <input class="search_id" type="button" id="queryBooks" value="查询书籍">
                    <input class="add_id" type="button" id="addBooks" value="添加书籍">
                </form>
            </div>

            <div id="search_body">
                <table border="1px" id="body">

                </table>
            </div>

            <div id="search_bo">

            </div>
        </div>
    </div>
</body>
</html>
